<template>
	<view>
		<view v-if="List.status === 1">
			<text>已接单</text>
		</view>
		<view v-else>
			<text>等待接单中</text>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				List: '',
			}
		},
		created() {
			this.socket()
		},
		methods: {
			//webSocket
			socket() {
				//创建webSocket
				this.webSocketTask = uni.connectSocket({
					url: 'ws://localhost:7001/ruoyi-merchant/imserver/7',
					success(res) {
						console.log('成功', res);
					},
				})

				// 消息的发送和接收必须在正常连接打开中,才能发送或接收【否则会失败】
				this.webSocketTask.onOpen((res) => {
					console.log("WebSocket连接正常打开中...！");
					this.is_open_socket = true;
					// 注：只有连接正常打开中 ，才能正常成功发送消息
					this.webSocketTask.send({
						data: "uni-app发送一条消息",
						async success() {
							console.log("消息发送成功");
						},
					});
					// 注：只有连接正常打开中 ，才能正常收到消息
					this.webSocketTask.onMessage((res) => {
						console.log("收到的消息:", res.data); // 添加日志输出
						// 检查是否是有效的 JSON 字符串
						if (res.data && res.data.trim().startsWith('{')) {
							this.show = true;
							try {
								let data = JSON.parse(res.data);
								this.List = data;
							} catch (error) {
								console.error("解析 JSON 失败:", error);
							}
						} else {
							console.warn("收到非 JSON 数据:", res.data); // 处理非 JSON 数据
						}
					});
				})
			},
		}
	}
</script>

<style>
	text{
		font-size: 30px;
		margin-left: 20%;
		line-height: 200px;
		color: brown;
	}
</style>